<template>
<!--flex容器-->
<div class="containerMain">
    <div class="containerC1">
        <!-- 学校标签 -->
        <div class="t01"><img :src="this.picturelib[0].url" id="p01"></div>
        <div class="t02" style="font-family: 华光行草_CNKI;font-size:40px">人上人学校</div>
    </div>
    <!-- 日期 -->
    <div class="t03"><h2>{{today}}</h2></div>
    <div class="t04">
        <!-- 下拉框 -->
        <el-dropdown @command="handleCommand">
            <span class="el-dropdown-link">
                <img :src="this.picturelib[1].url" id="p02" @click="jumpMember">
            </span>
            <el-dropdown-menu slot="dropdown">
                <!-- command传回数值，为字符串String -->
                <el-dropdown-item command=1><div>用户中心</div></el-dropdown-item>
                <el-dropdown-item command=0><div>返回主页</div></el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>
    </div>
</div>

</template>

<script>
import dayjs from 'dayjs'
export default {
name:"TopLogMsg",
data(){
    return{
        today:'',//保存当日时间
        timer:'',//保存计时器id
        picturelib:[{url:require('../../assets/university.png')},//图片信息
                     {url:require('../../assets/person.png')},]
    }
},
methods:{
    jumpMember(){
        // alert("To member page")//跳转到用户页面
    },
    handleCommand(command){
        if(command=="1"){window.location.href='/admin.html#/StudentInfoEdit'}//跳转到用户页面
        else{window.location.href='/home.html'}//跳转到主页面
    }

},
mounted() {
    // this.timer = setInterval(()=>{
    //     const timestamp = new Date().getTime();
    //     this.today = dayjs(timestamp).format('YYYY MM-DD HH:mm:ss')
    // },1000)
},
beforeDestroy(){
    clearInterval(this.timer)
}
}
</script>

<style>
#p01,#p02{
    width: 50px;
    height: 50px;
}
.containerMain{
    padding-top:3px;
    width:100%;
    height:60px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(80, 59, 13, 0.4);
    box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.6);
}
.containerC1{
    width:40%;
    display:flex;
    justify-content: flex-start;
    align-items: center;
}
div.t03{
    width:50%;
}
.el-dropdown-link {
    cursor: pointer;
}
</style>
